<!DOCTYPE html>
<html>
<head>
    <meta http-equiv='Content-Type' content='text/html; charset=utf-8'>
    <title>Slider</title>
    <link rel="stylesheet" href="carousel.css"/>
    <script type="text/javascript" src="jquery-1.4.4.min.js"></script>
    <script type="text/javascript" src="jquery.mousewheel.js"></script>
    <script type="text/javascript" src="jquery.carousel.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $('.carousel').carousel({carouselWidth:930, carouselHeight:240, frontWidth: 220,hMargin: 0.7, vMargin: 0.2,
            frontHeight: 220, buttonNav:'bullets', slidesPerScroll: 6, directionNav:true, shadow:true, autoplay: true, reflection:false });
        });
    </script>

</head>
<body>

<div class="list-wrap">

    <div id="atab">
        <div class="carousel"> <!-- BEGIN CONTAINER -->

            <div class="slides"> <!-- BEGIN CAROUSEL -->

                <div><a href="#"><img src="images/slide1.png" alt="" /></a></div>
                <div><a href="#"><img src="images/slide2.png" alt="" /></a></div>
                <div><a href="#"><img src="images/slide3.png" alt="" /></a></div>
                <div><a href="#"><img src="images/slide4.png" alt="" /></a></div>
                <div><a href="#"><img src="images/slide5.png" alt="" /></a></div>
                <div><a href="#"><img src="images/slide6.png" alt="" /></a></div>
                <div><a href="#"><img src="images/slide7.png" alt="" /></a></div>
                <div><a href="#"><img src="images/slide8.png" alt="" /></a></div>

            </div> <!-- END SLIDES -->

    </div>
</div>
</body>
</html>